<template>
  <div>
    <el-row style="text-align: left;line-height: 50%">
      <el-col :span="6">
        <h2 style="margin-left: 10px">区块链教学系统</h2>
      </el-col>
      <el-col :span="2" :offset="16">
        <el-button type="text" @click="rollbackHome">返回</el-button>
        <el-button type="text" @click="logout">登出</el-button>
      </el-col>

    </el-row>
    <el-menu class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-submenu index="1">
        <template slot="title">
          <span>智能合约</span>
        </template>
        <el-menu-item index="1-1">HelloWorld</el-menu-item>
        <el-menu-item index="1-2">食品溯源</el-menu-item>
      </el-submenu>


    </el-menu>
  </div>

</template>

<script>
export default {
  name: "Navigator",
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath)
      if (key == '1-1') {
        this.$router.push('/helloworld')
      }
      if (key == '1-2') {
        this.$router.push('/feedtrace')
      }
    },
    rollbackHome() {
      this.$router.push('/')
    },
    logout() {
      this.$cookies.remove('token')
      this.$router.push('/login')
    }
  }
}
</script>

<style scoped>

</style>